<template>
  <div>
    <a-form-model :model='form' ref='userCompany' layout='vertical'>
      <a-form-model-item >
        <a-select v-model="form.organizationId" placeholder="请选择机构" style='width:96%' @change='organizationChange'>
          <a-select-option :value="item.organizationId" :key='index' v-for='(item,index) in organizationList'>
            {{item.organizationName}}
          </a-select-option>
        </a-select>
      </a-form-model-item>
      <a-form-model-item prop='companyIds'>
        <a-transfer
          :dataSource='companyList'
          v-model='form.companyIds'
          :listStyle="{width: '45%',height: '480px'}"
          :titles="['选择企业', '已选择企业']"
          :render='item=>item.title'
          :target-keys='form.companyIds'
          @change='handleTransferChange'
          filterable>
        </a-transfer>
      </a-form-model-item>
    </a-form-model>
  </div>
</template>

<script>
export default {
  name: "UserCompany",
  components: {},
  data() {

    return {
      companyList: [],
      organizationList: [],
      form: {
        userId: "",
        organizationId: "",
        companyIds: []
      }
    }
  },
  methods: {
    setData(data) {
      if (data && data.userId) {
        this.form.userId = data.userId
        this.form.organizationId = data.organizationId
        this.getAuthCompanyList(data.userId, data.organizationId)
      }
    },
    /**
     * 分配企业提交
     */
    handleSubmit() {
      this.$refs["userCompany"].validate(valid => {
        if (valid) {
          this.http.post(this, {
            url: this.api.managerUser.setCompany,
            data: {
              userId: this.form.userId,
              organizationId:this.form.organizationId,
              companyIds: this.form.companyIds.join(",")
            },
            success: function(me) {
              //me.$emit("handleClose")
            }
          })
        } else {
          return false
        }
      })
    },
    /**
     * 获取授权数据
     * @param userId
     * @param organizationId
     */
    getAuthCompanyList(userId, organizationId) {
      this.http.get(this, {
        url: this.api.company.getAuthCompanyList,
        data: {
          userId: userId,
          organizationId: organizationId
        },
        success: (me, data) => {
          data.companyList.map(item => {
            item.key = item.companyId
            item.title = item.companyName
          })
          me.companyList = data.companyList
          me.organizationList = data.organizationList
          me.form.companyIds = data.companyIds
        }
      })
    },
    organizationChange(value){
      this.getAuthCompanyList(this.form.userId,value)
    },
    /**
     * 穿梭框选择事件
     * @param targetKeys
     * @param direction
     * @param moveKeys
     */
    handleTransferChange(targetKeys, direction, moveKeys) {
      this.form.companyIds = targetKeys
    }
  },
  mounted: function() {
  }
}
</script>
